<script>

$(document).ready(function() {
	$("#validatebutton").click(function () {
		var email = $("#email").val();
		var password = $("#password").val();
		var firstname = $("#firstname").val();
		var lastname = $("#lastname").val();
		$.ajax({
		    type: 'POST',
		    url: context+'user/validate',
		    dataType: 'json',
		    async: false,
		    data:{'email':email,'password':password,'firstname':firstname,'lastname':lastname},
		    success: function(data){
			   if(data['success'])
			   {
				   $(location).attr('href',context+'user/confirm/'+data['email']);
			   }
			   else if(data['error'])
			   {
				   $("#error span").text(data['error']);
			   }
			   else if(data['exception'])
			   {
				   $("#error span").text(data['exception']);
			}
		    },
		    error: function(xhr, status, thrown){
		    	 $("#error span").text(xhr.responseText);
		    }
		});
		return false;
	});
});

</script>

<div class="hero-unit">

<div>
Create user account

<div id="error">
     <span></span>
  </div>
 <div>
     First Name
      <input id="firstname" type="text" value="firstname" />
  </div>
   <div>
     Last Name
      <input id="lastname" type="text" value="lastname" />
  </div>
  
  <div>
     Email
      <input id="email" type="text" value="email" />
  </div>
  <div>
     Password
      <input id="password" type="password" value="password" />
  </div>
   <div>
    Confirm your password
      <input id="confirm_password" type="password" value="password" />
  </div>
</div>
<button id="validatebutton">Validate</button>
</div>

 
 </div>

<div class="row">

</div>
